<!--%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%-->
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<title>Being Java Guys | Hello World</title>

<link href="<c:url value="/resources/ext-3.2/ext/resources/css/ext-all.css" />" rel="stylesheet"> 
<link href="<c:url value="/resources/ext-3.2/ext/examples/ux/css/ux-all.css" />" rel="stylesheet"> 
<link href="<c:url value="/resources/ext-3.2/ext/examples/ux/css/LockingGridView.css" />" rel="stylesheet"> 
<link href="<c:url value="/resources/ext-3.2/ext/customize/CheckboxSelectionModel.css" />" rel="stylesheet"> 
<link href="<c:url value="/resources/ext-3.2/ext/customize/CheckColumn.css" />" rel="stylesheet"> 
<link href="<c:url value="/resources/ext-3.2/ext/customize/SSLovField.css" />" rel="stylesheet"> 
<link href="<c:url value="/resources/ext-3.2/ext/customize/CheckboxCombo.min.css" />" rel="stylesheet">  

<script src="<c:url value="/resources/ext-3.2/ext/adapter/ext/ext-base-debug.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/ext-all-debug.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/examples/ux/ux-all-debug.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/Utilities.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/IFrameComponent.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/TextDateField.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/LovField.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/TextNumberField.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/EditorGridPanel.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/CheckBox.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/ComboBox.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/CheckBoxGroup.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/CheckColumn.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/LockingColumnModel.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/TextField.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/NumberField.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/TextArea.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/CheckboxSelectionModel.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/SSMultiSelectionBoxField.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/TwinTextField.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/ext/customize/CheckboxCombo.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/resources/SSLovField.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/resources/SSComboBox.js" />"></script> 
<script src="<c:url value="/resources/ext-3.2/resources/FormUtils.js" />"></script>
<script src="<c:url value="/resources/ext-3.2/plugin/GroupHeaderPlugin.js" />"></script>
<script src="<c:url value="/resources/ext-3.2/plugin/SmartCheckBoxSelectionModel.js" />"></script>  
<script src="<c:url value="/resources/ext-3.2/plugin/PagingToolbar.js" />"></script>

</head>
<body>

	<center>
		<!--h2>Being Java Guys | Hello World</h2>
		<h3>Please select a file to upload !</h3>
		<br />
		<form:form method="post" enctype="multipart/form-data"		
					modelAttribute="uploadedFile" action="fileUpload.html">
		
			<table>
				<tr>
					<td>Upload File:&nbsp;</td>
					<td><input type="file" name="file" />
					</td>
					<td style="color: red; font-style: italic;"><form:errors	path="file" />
					</td>
				</tr>
				<tr>
					<td>&nbsp;</td>
					<td><input type="submit" value="Upload" />
					</td>
					<td>&nbsp;</td>
				</tr>
			</table>
		</form:form-->	
	<div id="mainDiv" style="height:100px;width:250px;"></div>
	</center>
	<script type="text/javascript">
	/*!
	 * Ext JS Library 3.0
	 * Copyright(c) 26-12-2556
	 * author Anuchit Prasertsang
	 */

	 Ext.onReady(function(){
		 
		    Ext.QuickTips.init();
		 
		    var msg = function(title, msg){
		        Ext.Msg.show({
		            title: title,
		            msg: msg,
		            minWidth: 200,
		            modal: true,
		            icon: Ext.Msg.INFO,
		            buttons: Ext.Msg.OK
		        });
		    };
		 
		    var fp = new Ext.FormPanel({
		        renderTo: 'mainDiv',
		        fileUpload: true,
		        width: 500,
		        frame: true,
		        title: 'File Upload Form',
		        autoHeight: true,
		        bodyStyle: 'padding: 10px 10px 0 10px;',
		        labelWidth: 10,
		        defaults: {
		            anchor: '95%',
		            allowBlank: false,
		            msgTarget: 'side'
		        },
		        items: [{
		            xtype: 'fileuploadfield',
		            id: 'form-file',
		            emptyText: 'Select a File to import',
		            fieldLabel: 'File',
		            name: 'file',
		            buttonCfg: {
		                text: '',
		                iconCls: 'upload-icon'
		            }
		        }],
		        buttons: [{
		            text: 'Upload',
		            handler: function(){
		                if(fp.getForm().isValid()){
		                    fp.getForm().submit({
		                        url: 'fileUpload.html',
		                       // waitMsg: 'Uploading your file...',
		                        success: function(fp, o){
		                            //msg('Success', 'Processed file on the server');
		                        	 Ext.Msg.alert('Success', 'Your file has been uploaded.');
		                        }
		                    });
		                    Ext.Msg.alert('Success', 'Your file has been uploaded.');
		                }
		               
		            }
		        },{
		            text: 'Reset',
		            handler: function(){
		                fp.getForm().reset();
		            }
		        }]
		    });
		 
		});
	</script> 
</body>
</html>
